﻿@model GUI.Models.ArticleModel
<script src="~/Scripts/jquery-1.9.0.min.js"></script>

<style>
    .titleArticle {
        background-color: blue;
    }


    #tdetart, #tdetart2, #tdetart3, #tdetart4, #tdetart33, #tdetart333 {
        direction: ltr;
        padding: 100px;
    }

    .tdetart {
        padding: 700px;
        margin-left: 20%;
    }

    .tdetart1, .tdetart2, .tdetart3, .tdetart4, .tdetart33, tdetart333, td {
        direction: rtl;
        padding: 100px;
        text-align: left;
    }

    #tde1, #tdet2,#tde3,#tde4,#tde33,#tde333,td{
        direction: ltr;
        padding: 100px;
        text-align: right;
    }
    .lefttoright {
          direction: ltr;
        padding: 100px;
        text-align: left;
       
    }
     .righttoleft table {
        padding: 100px;
        text-align: right;
        background-color:grey;
        text-align :right;
    }
</style>

<script type="text/javascript">
   
    
    $( document ).ready(function() {

        var ftb = $(".tdetart");  var  ftb1=$(".tdetart1"); var ftb2=$(".tdetart2"); var ftb3 =$(".tdetart3"); var ftb4=$(".tdetart4");
        var ftb5=$(".tde5")  ;
        var ftb33=$(".tdetart33");var ftb333=$(".tdetart333");
       
        var tb1= $("#tde1");
        var tb2=$("#tde2");
        var tb3=$("#tde3");  var tb4=$("#tde4");  var tb33=$("#tde33");  var tb333=$("#tde333");var tb5=$("#tdetart5");
        var inculture=  $("#hidculture").val();
        var rlang="Romain";
        var alang="عربي";

        var culture =@Html.Raw(Json.Encode(ViewBag.culture));
        if (culture===rlang){
           
            ftb.addClass("lefttoright");
            ftb1.addClass("lefttoright");
            ftb2.addClass("lefttoright");
            ftb3.addClass("lefttoright");
            ftb4.addClass("lefttoright");
            ftb3.addClass("lefttoright");
            ftb333.addClass("lefttoright");
            ftb5.addClass("lefttoright");
            
        }else {

            tb1.addClass("righttoleft").css("direction","rtl");
            tb2.addClass("righttoleft").css("direction","rtl");
            tb3.addClass("righttoleft").css("direction","rtl");
            tb4.addClass("righttoleft").css("direction","rtl");
            tb33.addClass("righttoleft").css("direction","rtl");
            tb333.addClass("righttoleft").css("direction","rtl");
            tb5.addClass("righttoleft").css("direction","rtl");
           
           
           
           
        }
              
    });


</script>





<table class="tdetart">

    <caption>
    </caption>
    <tr>
      <td>@Html.LabelFor(model=>model.Themes)</td>
        <td style="padding: 15px; text-align: center">
            @if (@ViewBag.themes != null)
            {
                foreach (var item in @ViewBag.themes)
                {
                <span style="color: GrayText">@item.Subjects</span>
                }
            }
        </td>
        
    </tr>
</table>




<!-- first tr dealing with imagesbytes -->

            <input type="hidden" id="hidculture" value="@Model.Culture" name="@Model.Culture" />
        

@if (Model.ImageBytes != null && Model.ImageLittle == null && Model.ImageMedium == null)
{
    <table id="tde1" class="tdetart1">

        <tr>

            <td style="width: 45%; padding: 15px">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.imagebyte)" style="width:700px; height:350px" />
            </td>

            <td colspan="2">
                <article>
                    @Html.Raw(@Model.ArticleContenent)
                </article>
            </td>
        </tr>
    </table>
}


@if (Model.ImageBytes != null && Model.ImageMedium != null && Model.ImageLittle == null)
{
    <table id="tde2" class="tdetart2">
        <tr>

            <td style="width: 45%; padding: 15px">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.imagebyte)" style="width:700px; height:350px" />
            </td>


            <td colspan="2">
                <article>
                    @Html.Raw(@Model.ArticleContenent)
                </article>
            </td>

        </tr>

        <tr>
            <td colspan="2" style="padding: 10px; margin-right: 55px; text-align: center;">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageMedium)" style="width:400px; height:250px" />
            </td>
        </tr>

    </table>
           
}



@if (Model.ImageBytes != null && Model.ImageMedium != null && Model.ImageLittle != null)
{

    <table id="tde3" class="tdetart3">
        <tr>

            <td style="width: 45%; padding: 15px">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.imagebyte)" style="width:700px; height:350px" />
            </td>


            <td colspan="2">
                <article>
                    @Html.Raw(@Model.ArticleContenent)
                </article>
            </td>

        </tr>

        <tr>
            <td colspan="2" style="padding: 10px; margin-right: 55px; text-align: center;">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageMedium)" style="width:400px; height:250px" />
            </td>
        </tr>
        <tr>
            <td colspan="2" style="padding: 10px; margin-right: 55px; text-align: center;">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageLittle)" style="width:200px; height:100px" />
            </td>
        </tr>

    </table>
 
}





@if (Model.ImageBytes != null && Model.ImageMedium == null && Model.ImageLittle != null)
{

    <table id="tde33" class="tdetart33">
        <tr>

            <td style="width: 45%; padding: 15px">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.imagebyte)" style="width:700px; height:350px" />
            </td>


            <td colspan="2">
                <article>
                    @Html.Raw(@Model.ArticleContenent)
                </article>
            </td>

        </tr>

        <tr>
            <td colspan="2" style="padding: 10px; margin-right: 55px; text-align: center;">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageLittle)" style="width:200px; height:100px" />
            </td>

        </tr>



    </table>
 

}


@if (Model.ImageBytes == null && Model.ImageMedium != null && Model.ImageLittle != null)
{

    <table id="tde333" class="tdetart333">
        <tr>

            <td colspan="2" style="padding: 10px; margin-right: 55px;">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageMedium)" style="width:400px; height:250px" />
            </td>


            <td colspan="2">
                <article>
                    @Html.Raw(@Model.ArticleContenent)
                </article>
            </td>

        </tr>

        <tr>
            <td>
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageLittle)" style="width:700px; height:350px" />
            </td>

        </tr>

        <tr>
            <td colspan="2" style="padding: 10px; margin-right: 55px; text-align: center;">
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageMedium)" style="width:400px; height:250px" />
            </td>
        </tr>
        <tr>
            <td>
                <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageLittle)" style="width:700px; height:350px" />
            </td>
        </tr>

    </table>
 

}


@if (Model.ImageBytes == null && Model.ImageMedium == null & Model.ImageLittle == null)
{
    <table id="tde4" class="tdetart5">
        <tr>



            <td colspan="2">
                <article>
                    @Html.Raw(@Model.ArticleContenent)
                </article>
            </td>

        </tr>

        <tr>
            @{
    dynamic isactif = ViewBag.isactif;
            }
            @if (isactif == false)
            {
                <td>
                    <img src="~/Images/unlike.png" alt="" />
                </td>
            }

            <td>

                @Html.DisplayFor(model => model.CreationDate)
            </td>
        </tr>

    </table>

    
}   
    
    
    
    @if (Model.ImageBytes == null && Model.ImageMedium != null & Model.ImageLittle == null)
{
  
        
          <table id="tde5" class="tdetart1">

        <tr>

            <td style="width: 45%; padding: 15px">
               <img src="data:image;base64,@System.Convert.ToBase64String(@ViewBag.ImageMedium)" style="width:400px; height:250px" />
            </td>

            <td colspan="2">
                <article>
                    @Html.LabelFor(model=>model.ArticleContenent)
                    @Html.Raw(@Model.ArticleContenent)
                </article>
            </td>
        </tr>
    </table>
    
    
    
    
    
}




















<p>
    @Html.ActionLink("Articles", "Create", new { set02568auId = @Html.Encode(@ViewBag.id) })
    @Html.ActionLink("Edit", "EditArticle", new { id_article_to_edit = @Html.Encode(@ViewBag.id) })|
    @Html.ActionLink("Back to List", "Index", new  { id=ViewBag.idauthor})
</p>
